@extends('admin.common.main')
@section('cnt')
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 用户中心 <span class="c-gray en">&gt;</span> 权限管理 <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
    @include('admin.common.message')
    <div class="page-container">
        <form method="get" action="">
        <div class="text-c"> 日期范围：
            <input type="text" value="{{$stime}}" name="stime" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'datemax\')||\'%y-%M-%d\'}' })" id="datemin" class="input-text Wdate" style="width:120px;">
            -
            <input type="text" value="{{$etime}}" name="etime" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'datemin\')}',maxDate:'%y-%M-%d' })" id="datemax" class="input-text Wdate" style="width:120px;">
            <input type="text" class="input-text" style="width:250px" placeholder="输入角色" id="" value="{{$kw}}" name="name">
            <button type="submit" class="btn btn-success radius" id="" name=""><i class="Hui-iconfont">&#xe665;</i> 搜角色</button>
        </div>
        </form>
        <div class="cl pd-5 bg-1 bk-gray mt-20">
        <span class="l">
            {{--<a onclick="deleteAll()" class="btn btn-danger radius" >--}}
                {{--<i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a>--}}
            <a href="{{route('admin.role.create')}}"  class="btn btn-primary radius">
                <i class="Hui-iconfont">&#xe600;</i> 添加角色
            </a>
        </span>
        </div>
        <div class="mt-20">
            <table class="table table-border table-bordered table-hover table-bg table-sort">
                <thead>
                <tr class="text-c">
                    <th width="80">ID</th>
                    <th width="100">角色名称</th>
                    <th width="100">查看权限</th>
                    <th width="40">加入时间</th>
                    <th width="100">操作</th>
                </tr>
                </thead>
                <tbody>
                @foreach($data as $item)
                    <tr class="text-c">
                        <td>{{$item->id}}</td>
                        <td>{{$item->name}}</td>
                        <td>
                        <a href="{{route('admin.role.node',$item)}}" class="label label-success radius">权限</a>
                        </td>
                        <td>{{$item->created_at}}</td>
                        <td class="td-manage">
                            <a href="{{route('admin.role.edit',$item)}}" class="label label-secondary radius">修改</a>
                            <a href="{{route('admin.role.destroy',['id'=>$item->id])}}" class="label label-danger radius delbtn">删除</a>
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
            {{$data->links()}}
        </div>
    </div>
    @endsection


@section('js')
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="/admin/lib/My97DatePicker/4.8/WdatePicker.js"></script>
{{--<script type="text/javascript" src="/admin/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>--}}
<script type="text/javascript" src="/admin/lib/laypage/1.2/laypage.js"></script>
<script type="text/javascript">
    /*用户-删除*/
    //生成一个token
    const _token="{{csrf_token()}}";
    //给删除按钮绑定事件
    $('.delbtn').click(function (evt) {
        //得到请求的url地址
        let url=$(this).attr('href');
        $.ajax({
            url,
            data:{_token},
            type:'DELETE',
            dateType:'json'
        }).then(({status,msg})=>{
            if(status==0){
                layer.msg(msg,{time:2000,icon:1},()=>{
                    //删除当前行
                    $(this).parents('tr').remove();
                })
            }
        });
        //jquery 取消默认事件
        return false;
    });
   //全选删除
    function deleteAll()
    {
        layer.confirm('您确定要删除选中的所有用户嘛？', {
            btn: ['确认删除','思考一下'] //按钮
        }, ()=>{
            //选中的用户
            let ids = $('input[name="id[]"]:checked');
            //删除的id
            let id=[];
            //循环
            $.each(ids,(key,val)=>{
                // id.push($(val).val()) //dom对象转jquery对象 $(dom对象)
                //方法二
                id.push(val.value);
            });
            if(id.length>0){
                //发起ajax
                $.ajax({
                    url:"{{route('admin.user.delall')}}",
                    data:{id,_token},
                    type:'DELETE'
                }).then(ret=>{
                    if(ret.status==0){
                        layer.msg(ret.msg,{time:2000,icon:1},()=>{
                            location.reload();
                        })
                    }
                })
            }
        });

    }
</script>
@endsection
